<template>
  <div class="forget-pwd">
    <div class="input-div">
      <span class="left">讲师姓名</span>
      <input type="text" v-model="truename" class="input" placeholder="请输入姓名">
    </div>
    <div class="input-div">
      <span class="left">手机号码</span>
      <input type="text" v-model="mobile" class="input" placeholder="请输入手机号码">
    </div>
    <div class="input-div mab">
      <span class="left">初始密码</span>
      <input type="text" v-model="pwd" class="input" placeholder="请输入登录的初始密码">
    </div>
    <span class="btn" @click="submit()">提交</span>
    <toast v-model="is_toast" type="text" width="20em">{{toast_con}}</toast>
  </div>
</template>

<script>
    import {teacherdetail,teacheredit} from '@/api/api'
    import {Toast } from 'vux'

  export default {
    components: {
      Toast
    },
    data () {
      return {
        alert: {},
        truename:'',
        mobile:'',
        pwd:'',
        status:1,
        is_toast:false,
        toast_con:'默认'
      }
    },
    created () {
      this.alert = {
        tip: '恭喜您，绑定手机号成功',
        btn: '返回',
        path: {path: '/bindPhone'},
        is_show: false
      }
      this.id = this.$route.query.id
      this.detail()
    },
    methods: {
      router (path) {
        this.$router.push(path)
      },
      detail(){
        teacherdetail(this.id).then((res) =>{
          console.log(res)
          this.truename=res.data.info.truename
          this.mobile=res.data.info.mobile
          this.pwd=res.data.info.pwd
        }).catch((err) => {
          console.dir(err)
        })
      },
      submit () {
        console.log('bb');
        this.alert.is_show = true
        if(!this.truename || !this.mobile || !this.pwd){
          this.is_toast = !this.is_toast
          this.toast_con = '请填写完整信息'
        }
        teacheredit(this.id,this.truename,this.mobile,this.pwd,this.status).then((res) =>{
          console.log(res)
          console.log(res.data.status)
          if(res.data.status==1){
            if(this.id){
              this.router({path: './teacherComment',query:{id:this.id}})
            }else{
              this.router({path: './teacherManage'})
            }
          }else{
            this.is_toast = !this.is_toast
            this.toast_con = res.data.info
          }
        }).catch((err) => {
          console.dir(err)
        })
      }
    }
  }
</script>

<style lang="stylus" scoped>
.forget-pwd
  min-height 100vh
  background-color #f5f5f5
  .input-div
    background-color #fff
    border-bottom 1px solid #e6e6e6
    overflow hidden
    line-height 5rem
    height 5rem
    padding 0 1.5rem
    position relative
    .left
      float left
      color #333
      font-size 1.5rem
      width 9rem
    .input
      position absolute
      left 9.5rem
      height 5rem
      line-height 5rem
      width calc(100vw - 13rem)
      margin-left 1rem
      outline none
      font-size 1.5rem
      &::-webkit-input-placeholder
        color #ccc
    .code
      color #172F6D
      font-size 1.5rem
      line-height 2rem
      height 2rem
      position absolute
      width 9.4rem
      top 1.5rem
      right 0
      text-align center
      border-left 1px solid #172F6D
  .btn
    width 92%;
    margin-left 4%
    height 5.3rem
    line-height 5.3rem
    margin-top 1.5rem
    text-align center
    color #fff
    background-color #172F6D
    border-radius 100px
    font-size 1.7rem
    font-weight bold
    display block
</style>
